<template>
	<view class="overflow-hidden">
		<view class="tab-container bg-ffffff">
		    <view  v-for="(item, index) in buttons" :key="index"  class="tab-item" 
		      :class="{ 'active': currentIndex === index }" @click="currentIndex = index" >
		       {{ item.text }}
		    </view>
		</view>	
		<view v-if="currentIndex==0" class="margin-15 overflow-hidden">
			<view class="margin-b-10 text-16">基础信息</view>
			<view class="bg-ffffff border-radius-5 basis-item">
				<view class="form-group">
				  <view class="label"><text class="point-icon">*</text><text class="label-title">企业名称</text></view>
				  <view >	
					  <input class="uni-input" v-model="qymc" placeholder="请输入" />
					</view>
				</view>
				<view class="form-group"> 
				  <view class="label"><text class="point-icon">*</text><text class="label-title">所在地</text></view>
				  <view >
					<picker mode="multiSelector" :range="multiSelect" :range-key="'name'" @columnchange="onColumnChange" @change="onPickerChange">
					      <view class="picker">{{ selectedAddress || '请选择' }}</view>
					</picker>
				  </view>
				</view>
				<view class="form-group">
				  <view class="label"><text class="point-icon">*</text><text class="label-title">注册年限</text></view>
				  <view >
				     <picker @change="changeNy($event,zcnx_list,'zcnx')" :range="zcnx_list" range-key="value">
				        <view class="picker">{{ zcnxt || '请选择' }}</view>
				     </picker>
				  </view>
				</view>
				<view class="form-group">
				  <view class="label"><text class="point-icon">*</text><text class="label-title">法人信用状态</text></view>
				  <view >
				     <picker @change="changeNy($event,frxy_list,'frxy')" :range="frxy_list" range-key="value">
				        <view class="picker">{{ frxyt || '请选择' }}</view>
				     </picker>
				  </view>
				</view>
				<view class="form-group">
				  <view class="label"><text class="label-title">备案完整性</text></view>
				  <view >
				    <picker @change="changeNy($event,bawz_list,'bawz')" :range="bawz_list" range-key="value">
				      <view class="picker">{{ bawzt || '请选择经营场所备案情况' }}</view>
				    </picker>
				  </view>
				</view>
			</view>
			<view class="margin-b-10 text-16 margin-t-10">信用状态</view>
			<view class="bg-ffffff padded-10 border-radius-5 basis-item ">
				<view class="form-group">
				  <view class="label">近三年逾期次数</view>
				  <view >	
					  <input type=number class="uni-input" v-model="yqcs"  placeholder="请输入" />
				  </view>
				</view>
				<view class="form-group">
					<view class="label">当前逾期情况</view>
					<view class="color-99A0AA">
						<radio-group ref="myRadioGroup"  @change="change_radio($event)">
							<label class="radio margin-r-10"><radio :checked="isSelected1" value="未结清"  />未结清</label>
							<label class="radio"><radio :checked="isSelected2" value="已结清"  />已结清</label>
						</radio-group>
						
					</view>
				</view>
			
				<view class="form-group">
				  <view class="label">合作机构数量</view>
				  <view >
				  	<input type=number class="uni-input" v-model="hzjg"  placeholder="请输入" />
				  </view>
				</view>
				<view class="form-group">
				  <view class="label">P2P借贷情况</view>
				  <view >
				  	<input type=number class="uni-input" v-model="p2pjd"  placeholder="请输入" />
				  </view>
				</view>
			</view>
		
		</view>
	    
	    <view v-else-if="currentIndex==1" class="margin-15 company-details overflow-hidden">
	    			<view class="margin-b-10 text-16 font-weight">财务与经营</view>
	    			<view class="bg-ffffff border-radius-5 basis-item">
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">资产总额</text></view>
	    					<view >	
	    						<input type=number class="uni-input" v-model="zcze"  placeholder="请输入资产总额" />
	    					</view>
	    				</view>
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">年营业额</text></view>
	    					<view >	
	    						<input type=number class="uni-input" v-model="nyye"  placeholder="近12个月营业总额" />
	    					</view>
	    				</view>
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">经营性情况</text></view>
	    					<view >	
	    						<input type=number class="uni-input" v-model="jyxqk" style="width: 200px;"  placeholder="近12个月现金流为正的月份数量" />
	    					</view>
	    				</view>
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">核心客户合作情况</text></view>
	    					<view >	
	    						<picker @change="changeNy($event,hxkh_list,'hxkh')" :range="hxkh_list" range-key="value">
	    						   <view class="picker">{{ hxkht || '请选择' }}</view>
	    						</picker>
	    					</view>
	    				</view>
	    				
	    			</view>
	    		
	    </view>
	    <view v-else-if="currentIndex==2" class="margin-15 company-details overflow-hidden">
	    			<view class="margin-b-10 text-16 font-weight">资产与行业</view>
	    			<view class="bg-ffffff border-radius-5 basis-item">
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">抵押物类型</text></view>
	    					<view >	
								<picker @change="changeNy($event,dywlx_list,'dywlx')" :range="dywlx_list" range-key="value">
								   <view class="picker">{{ dywlxt || '请选择抵押资产类型' }}</view>
								</picker>
	    					</view>
	    				</view>
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">资金流向</text></view>
	    					<view >	
	    						<picker @change="changeNy($event,zjlx_list,'zjlx')" :range="zjlx_list" range-key="value">
	    						   <view class="picker">{{ zjlxt || '请选择' }}</view>
	    						</picker>
	    					</view>
	    				</view>
						<!--
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">所属行业</text></view>
	    					<view >	
	    						<picker @change="change" :range="list">
	    						  <view class="picker">请选择公司所属行业</view>
	    						</picker>
	    					</view>
	    				</view>
						-->
	    				<view class="form-group">
	    					<view class="label"><text class="label-title">行业政策支持情况</text></view>
	    					<view >	
								<picker @change="changeNy($event,hyfl_list,'hyfl')" :range="hyfl_list" range-key="value">
								   <view class="picker">{{ hyflt || '请选择' }}</view>
								</picker>
	    					</view>
	    				</view>
	    			</view>
	    </view>
		<view class="button-group">
			<button class="btn left-btn" type="primary" plain="true" size="mini" :data-url="'/pages/product/list'"  @click="clickJump" >取消</button>
			<button class="btn right-btn" type="primary" size="mini"  @click="submit">保存</button>
		</view>
	</view>
</template>
pages/component/picker/picker.vue
<script>
	export default {
		onLoad(options) {
			const id = options.id;
			if (id) {
			    const decodedId = decodeURIComponent(id);
			    if (decodedId) {
					this.getbd(id);
			    }
			}
			this.getServerData();
			this.getssq();
		},
		data() {
			return {
				isSelected1: false ,
				isSelected2: false ,
				list:[],
				zcnx_list:[
					{ id: 9,value: "注册满 5 年且无异常变更" },
					{ id: 6,value: "注册 3-5 年，变更记录较少" },
					{ id: 3,value: "注册＜3 年或频繁变更" },
				],
				frxy_list:[
					{ id: 9,value: "无失信 / 限高记录，征信优秀" },
					{ id: 6,value: "近 3 年无严重失信，征信良好" },
					{ id: 3,value: "存在失信记录或征信较差" },
				],
				bawz_list:[
					{ id: 6,value: "备案齐全" },
					{ id: 3,value: "备案缺失" },
				],
				hxkh_list:[
					{ id: 9,value: "前三大客户合作≥5 年" },
					{ id: 6,value: "前三大客户合作 3-5 年" },
					{ id: 3,value: "前三大客户合作＜3 年" },
				],
				dywlx_list:[
					{ id: 0,value: "无抵押" },
					{ id: 9,value: "住宅/商业地产，抵押率≤50%" },
					{ id: 6,value: "工业房产/设备，抵押率50%-70%" },
					{ id: 3,value: "存款/应收账款或存在争议资产" },
				],
				zjlx_list:[
					{ id: 9,value: "专户监控且清晰" },
					{ id: 6,value: "期报告流向" },
					{ id: 3,value: "流向不明无法追溯" },
				],
				hyfl_list:[
					{ id: 9,value: "新能源 / AI 等政策支持类" },
					{ id: 6,value: "高端制造 / 现代农业等稳定发展类" },
					{ id: 3,value: "高污染 / 产能过剩等限制类" },
				],
				
				currentIndex: 0, // 默认选中第一个
				buttons: [
					{ text: "基础信息" },
					{ text: "经营与财务" },
					{ text: "资产与行业" }
				],
				array:[],
				selectedRadio: '',

				id:'',
				multiSelect: [[], [], []], // 省市区三级数据
				provinces: [], // 省列表
				cities: [], // 市列表
				districts: [], // 区列表
				pcd:[],
				selectedAddress: '' ,// 选中的地址
				selectedAddressid: [],
				qymc:'',
				zcnx:'',
				zcnxt:'',
				frxy:'',
				frxyt:'',
				bawz:'',
				bawzt:'',
				
				yqcs: '',
				dbyq: '',
				hzjg: '',
				p2pjd: '',
				
				zcze: '',
				nyye: '',
				
				jyxqk: '',
				hxkh: '',
				hxkht: '',
				dywlx: '',
				dywlxt: '',
				dywzt: '',
				
				zjlx: '',
				zjlxt: '',
				sshy: '',
				sshyt: '',
				hyfl: '',
				hyflt: '',
			}
		},
		onReady() {
			
		},
		methods: {
			getServerData() {
				this.$request().then(res => {
					// 验证登入
				})
			},
			getbd(id) {
				uni.request({
					url: 'https://wn.wdyky.com/index/jrgl/getqyxq', 
					method: 'GET',
					data: {
						id: id,
					},
					success: (res) => {
						if(res.data.code == 1){ 
							this.qymc = res.data.data.qymc;
							
							this.id = id;
							this.selectedAddress = res.data.data.selectedAddress;
							this.selectedAddressid = res.data.data.szdarr;
							
							if(res.data.data.frxy != ''){
								const frxy = this.frxy_list.find(frxy_list => frxy_list.id == res.data.data.frxy);
								this.frxyt = frxy.value;
								this.frxy = frxy.id;
							}
							if(res.data.data.zcnx != ''){
								const zcnx = this.zcnx_list.find(zcnx_list => zcnx_list.id == res.data.data.zcnx);
								this.zcnxt = zcnx.value;
								this.zcnx = zcnx.id;
							}
							if(res.data.data.bawz != ''){
								const bawz = this.bawz_list.find(bawz_list => bawz_list.id == res.data.data.bawz);
								this.bawzt = bawz.value;
								this.bawz = bawz.id;
							}
							
							this.yqcs = res.data.data.yqcs;
							if(res.data.data.dbyq == '未结清'){
								this.isSelected1 = true;
							}
							if(res.data.data.dbyq == '已结清'){
								this.isSelected2 = true;
							}
							this.dbyq = res.data.data.dbyq;
							this.hzjg = res.data.data.hzjg;
							this.p2pjd = res.data.data.p2pjd;
							
							this.zcze = res.data.data.zcze;
							this.nyye = res.data.data.nyye;
							this.jyxqk = res.data.data.jyxqk;
							
							if(res.data.data.hxkh != ''){
								const hxkh = this.hxkh_list.find(hxkh_list => hxkh_list.id == res.data.data.hxkh);
								this.hxkht = hxkh.value;
								this.hxkh = hxkh.id;
							}
							
							if(res.data.data.dywlx != ''){
								const dywlx = this.dywlx_list.find(dywlx_list => dywlx_list.id == res.data.data.dywlx);
								this.dywlxt = dywlx.value;
								this.dywlx = dywlx.id;
							}
							
							if(res.data.data.zjlx != ''){
								const zjlx = this.zjlx_list.find(zjlx_list => zjlx_list.id == res.data.data.zjlx);
								this.zjlxt = zjlx.value;
								this.zjlx = zjlx.id;
							}
							
							if(res.data.data.hyfl != ''){
								const hyfl = this.hyfl_list.find(hyfl_list => hyfl_list.id == res.data.data.hyfl);
								this.hyflt = hyfl.value;
								this.hyfl = hyfl.id;
							}
						}
						
						//console.log('GET请求成功：', res.data);
					},
					fail: (err) => {
						console.error('GET请求失败：', err);
					}
				});
			},
			getssq() {
				  uni.request({
				      url: 'https://wn.wdyky.com/index/jrgl/ajaxarea', // 请求地址
				      success: (res) => {
				        // 请求成功的回调函数
				  		if(res.data.code == 1){ 
							console.log('请求成功:', res.data);
				  			this.pcd = res.data.data;
							this.provinces = this.pcd[1];
				  			this.multiSelect[0] = this.pcd[1];
							this.cities = this.pcd[2];
							this.multiSelect[1] = this.cities;
							this.districts = this.pcd[52];
							this.multiSelect[2] = this.districts;
				  		}
				  
				      },
				      fail: function(err) {
				          // 请求失败的回调函数
				          console.error('请求失败:', err);
				      }
				  });
			},
			async loadCities(provinceId) {
				this.cities = this.pcd[provinceId];
				this.multiSelect[1] = this.cities;
				// 重置区和街道数据
				this.districts = this.pcd[this.cities[0].id];
				this.multiSelect[2] = this.pcd[this.cities[0].id];
			},
			async loadDistricts(cityId) {
				
			    this.districts = this.pcd[cityId];
			    this.multiSelect[2] = this.districts;
			},
			async onColumnChange(e) {
				
			      const { column, value } = e.detail;
			      
			      switch(column) {
			        case 0: // 省变化
			          const selectedProvince = this.provinces[value];
			          await this.loadCities(selectedProvince.id);
			          break;
			        case 1: // 市变化
			          const selectedCity = this.cities[value];
			          await this.loadDistricts(selectedCity.id);
			          break;
			      }
			      // 注意：在某些平台，直接赋值multiSelect可能不会自动更新视图，需要使用this.$set或重新赋值整个数组
			      //this.$set(this.multiSelect, column + 1, this.multiSelect[column + 1]);
			},
			onPickerChange(e) {
		
			      const values = e.detail.value;
			      const province = this.provinces[values[0]];
			      const city = this.cities[values[1]];
			      const district = this.districts[values[2]];

			      this.selectedAddress = `${province.name}${city.name}${district.name}`;
				  this.selectedAddressid = [];
				  this.selectedAddressid.push(province.id);
				  this.selectedAddressid.push(city.id);
				  this.selectedAddressid.push(district.id);
				  console.log('selectedAddressid，携带值为', this.selectedAddressid);
			      // 触发父组件事件
			      this.$emit('change', {
			        province,
			        city,
			        district
			      });
			},
			changeNy:function(e,list,param) {

				//this.zcnx = e.detail.value,
				const selectedId = e.detail.value; // 获取选中的id
				const selectedItem = list[selectedId]; // 找到对应的项

				if (param == 'zcnx') {
					this.zcnx = selectedItem.id;
					this.zcnxt = selectedItem.value;
				}
				if (param == 'frxy') {
					this.frxy = selectedItem.id;
					this.frxyt = selectedItem.value;
				}
				if (param == 'bawz') {
					this.bawz = selectedItem.id;
					this.bawzt = selectedItem.value;
				}
				
				if (param == 'hxkh') {
					this.hxkh = selectedItem.id;
					this.hxkht = selectedItem.value;
				}
				if (param == 'dywlx') {
					this.dywlx = selectedItem.id;
					this.dywlxt = selectedItem.value;
				}
				if (param == 'zjlx') {
					this.zjlx = selectedItem.id;
					this.zjlxt = selectedItem.value;
				}
				if (param == 'hyfl') {
					this.hyfl = selectedItem.id;
					this.hyflt = selectedItem.value;
				}
				
				//this.zcnxt = this.ny_list.find(ny_list => ny_list.id === this.zcnx);
			},
			submit(){
				uni.request({
				    url: 'https://wn.wdyky.com/index/jrgl/qyxqsave', // 你的API接口地址
				    method: 'GET',
				    data: {
	
						id: this.id,
						szd: this.selectedAddressid,
						qymc: this.qymc,
						zcnx: this.zcnx,
						frxy: this.frxy,
						bawz: this.bawz,
						
						yqcs: this.yqcs,
						dbyq: this.dbyq,
						hzjg: this.hzjg,
						p2pjd: this.p2pjd,
						
						zcze: this.zcze,
						nyye: this.nyye,
						
						jyxqk: this.jyxqk,
						hxkh: this.hxkh,
						dywlx: this.dywlx,
						dywzt: this.dywzt,
						
						zjlx: this.zjlx,
						sshy: this.sshy,
						hyfl: this.hyfl,

				    },
				    success: (res) => {
						
						if(res.data.code != 1){
							uni.showToast({
								icon: 'none',
								title: res.data.val
							})
						}
						if(res.data.code == 1){
							uni.showToast({
								icon: 'none',
								title: res.data.val
							})
							uni.navigateBack();
						}
						//console.log('请求成功:', res.data);
				    },
				    fail: (err) => {
				        console.error('GET请求失败：', err);
				    }
				});
				
				/*
				if(this.enterprise==''){
					uni.showToast({
						icon: 'none',
						title: "请输入单价"
					})
				}
				*/
			},
			change_radio(e) {
			    // 获取选中的值
			    this.dbyq = e.detail.value;
			    //console.log('选中的值:', this.dbyq);
			    // 这里可以添加你的逻辑
			},
			// 跳转
			clickJump(e){

				uni.navigateBack();

			},
			
		}
	}
</script>

<style>
	.button-group {
	  display: flex;
	  margin: 15px;
	  margin-bottom: 50px;
	  
	}
	.left-btn {
	    background-color: #fff !important;
	   color: black !important;
	   width: 30%;
	   margin-right: 10px; /* 可选：增加间距 */
	}
	/* 右侧按钮（70% 宽度） */
	.right-btn {
	   width: 70%;
/* 	   background-color: #fff !important; */
	   color:#fff !important;
	}
	.btn{
		padding: 10px 0;
		border: 0 !important;
	}
	.point-icon{
		position: absolute;
		color: red;
		margin-right: 5px;
	}
	.label{
		padding-top: 5px;
		padding-left: 10px;
	}
	.label-title{
		margin-left: 10px;
	}
	.picker {
	    padding: 0 20rpx;
	    font-size: 28rpx;
	    color: #A1A1A1;
	}
	::v-deep .uni-select__input-box{
		height: inherit !important;
	}
	::v-deep .uni-select{
		padding-left: 0;
		border: 0 ;
		height: inherit !important;
	}
	.form-group {
	  display: flex;
	  padding: 15px 0;
	  justify-content: space-between;
	  border-bottom: 1px solid #F9F9F9;
	}
	.basis-item .form-group:last-child{
		border-bottom:0 !important;
	}
	::v-deep .input-placeholder{
		font-size: 12px;
		color: #9D9D9D;
		text-align: right;
		left:-10px !important;
	}
	.tab-container {
	   display: flex;
	    justify-content: space-between;
	}
	.tab-item {
	  flex: 1;
	  text-align: center;
	  padding: 20rpx;
	  color: #666;
	}
	.tab-item.active {
	  color: #2C8AFF;
	  font-weight: bold;
	  position: relative;
	}
	.tab-item.active::after{
		content: "";
	   position: absolute;
	   bottom: 0;
	   left: 50%;
	   transform: translateX(-50%);
	   width:75px;
	   height: 4rpx;
	   background: #0052D9;
	}
	.uni-input{
		text-align: right;
		padding-right: 5px;
	}
</style>
